<%= form_with model: [:admin, tag], local: true do |f| %>
  <% if !tag.persisted? %>
    <div class="crayons-field">
      <%= f.label :name, class: "crayons-field__label" %>
      <%= f.text_field :name, class: "crayons-textfield" %>
    </div>
  <% end %>
  <div class="crayons-field crayons-field--checkbox mt-3">
    <%= f.check_box :supported, class: "crayons-checkbox" %>
    <label class="crayons-field__label" for="tag_supported">
      Supported
      <p class="crayons-field__description">Allows the tag to be a searchable result when writing a post or a listing</p>
    </label>
  </div>
  <div class="crayons-field crayons-field--checkbox mt-3">
    <%= f.check_box :suggested, class: "crayons-checkbox" %>
    <label class="crayons-field__label" for="tag_suggested">
      Suggested
      <p class="crayons-field__description">Prioritizes the tag during user onboarding</p>
    </label>
  </div>
  <% if @subforems.present? && @subforems.any? %>
    <div class="crayons-field mt-3">
      <label class="crayons-field__label">Assign to Subforems</label>
      <div class="flex flex-wrap gap-4 mt-2">
        <% @subforems.each do |sf| %>
          <div class="crayons-field crayons-field--checkbox">
            <%= check_box_tag "tag[subforem_ids][]",
                              sf.id,
                              @existing_relationship_ids.include?(sf.id),
                              id: "tag_subforem_ids_#{sf.id}",
                              class: "crayons-checkbox" %>
            <%= label_tag "tag_subforem_ids_#{sf.id}",
                          sf.domain,
                          class: "crayons-field__label ml-2" %>
          </div>
        <% end %>
      </div>
    </div>
  <% end %>
  <div class="crayons-field mt-3">
    <%= f.label :badge_id, class: "crayons-field__label" %>
    <%= f.select(:badge_id, options_for_select(badges_for_options, tag.badge_id), { include_blank: true }, { class: "crayons-select" }) %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :alias_for, class: "crayons-field__label" %>
    <%= f.text_field :alias_for, value: tag.alias_for, class: "crayons-textfield" %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :pretty_name, class: "crayons-field__label" %>
    <%= f.text_field :pretty_name, value: tag.pretty_name, class: "crayons-textfield" %>
  </div>
  <div class="crayons-field crayons-field--checkbox mt-3">
    <%= f.check_box :requires_approval, class: "crayons-checkbox" %>
    <%= f.label :requires_approval, class: "crayons-field__label" %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :short_summary, class: "crayons-field__label" %>
    <%= f.text_field :short_summary, value: tag.short_summary, class: "crayons-textfield" %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :rules_markdown, class: "crayons-field__label" %>
    <%= f.text_area :rules_markdown, value: tag.rules_markdown, class: "crayons-textfield" %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :submission_template, class: "crayons-field__label" %>
    <%= f.text_area :submission_template, class: "crayons-textfield" %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :wiki_body_markdown, class: "crayons-field__label" %>
    <%= f.text_area :wiki_body_markdown, value: tag.wiki_body_markdown, class: "crayons-textfield" %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :context_note_instructions, class: "crayons-field__label" %>
    <%= f.text_area :context_note_instructions, value: tag.context_note_instructions, class: "crayons-textfield" %>
  </div>
  <div class="crayons-field mt-3">
    <%= f.label :bg_color_hex, "Tag color", class: "crayons-field__label" %>
    <div class="flex items-center w-100 m:w-50">
      <%= f.text_field :bg_color_hex, class: "crayons-textfield", value: tag.bg_color_hex.presence || "#000000", placeholder: "#000000", data: { color_picker: true, label_text: "Tag color" } %>
    </div>
  </div>
  <%= f.submit class: "crayons-btn mt-3" %>
<% end %>
<%= javascript_include_tag "enhanceColorPickers", defer: true %>
